:root {
  --space-lg:32px;
  --space:20px;
  --space-md:10px;
  --space-sm:8px;
  --space-xs:4px;
  --size-max:24px;
  --size-bd:18px;
  --size-lg:16px;
  --size:14px;
  --size-sm:12px;
  --size-ssm:10px;
  --radius-md:6px;
  --radius:8px;
  --radius-lg:10px;
  --color:rgba(0,0,0,.8);
  --color-seconedry-active:rgba(0,0,0,.85);
  --color-hover:#f5f5f5;
  --color-primary: rgb(22, 93, 255);
  --color-primary-hover:#40a9ff;
  --color-success:#52c41a;
  --color-success-hover:#73d13d;
  --color-warn:#faad14;
  --color-warn-hover:#ffc53d;
  --color-danger:#ff4d4f;
  --color-danger-hover:#ff7875;
  --color-gray:rgba(0,0,0,.45);
  --color-gray-hover:rgba(0,0,0,.35);
  --color-active:rgba(0, 0, 0, 0.06);
  --color-selected:#e6f4ff;
  --border-color:#f0f0f0;
  --border-radius:6px;
  --bg-color:#f0f2f5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  --transition:all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
  --box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.03), 0 1px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px 0 rgba(0, 0, 0, 0.02);
  --header-height: 56px
}
/*padding*/
.padding-none{padding: 0 !important;}
.padding{padding: var(--space) !important}
.padding-md{padding: var(--space-md) !important}
.padding-sm{padding: var(--space-sm) !important}
.padding-top{padding-top: var(--space)!important}
.padding-top-md{padding-top: var(--space-md)!important}
.padding-top-sm{padding-top: var(--space-sm)!important}
.padding-right{padding-right: var(--space)!important}
.padding-right-md{padding-right: var(--space-md)!important}
.padding-right-sm{padding-right: var(--space-sm)!important}
.padding-bottom{padding-bottom: var(--space)!important}
.padding-bottom-md{padding-bottom: var(--space-md)!important}
.padding-bottom-sm{padding-bottom: var(--space-sm)!important}
.padding-left{padding-left: var(--space)!important}
.padding-left-md{padding-left: var(--space-md)!important}
.padding-left-sm{padding-left: var(--space-sm)!important}
.padding-h-b{padding:0 20px 20px 20px}
.padding-x-0{padding-right:0 !important;padding-left:0 !important}
/*margin*/
.margin-none{margin:0!important;}
.margin{margin: var(--space) !important}
.margin-md{margin: var(--space-md) !important}
.margin-sm{margin: var(--space-sm) !important}
.margin-top{margin-top: var(--space)!important}
.margin-top-md{margin-top: var(--space-md)!important}
.margin-top-sm{margin-top: var(--space-sm)!important}
.margin-right-lg{margin-right: var(--space-lg)!important}
.margin-right{margin-right: var(--space)!important}
.margin-right-md{margin-right: var(--space-md)!important}
.margin-right-sm{margin-right: var(--space-sm)!important}
.margin-right-xs{margin-right: var(--space-sm)!important}
.margin-bottom-lg{margin-bottom: var(--space-lg)!important}
.margin-bottom{margin-bottom: var(--space)!important}
.margin-bottom-md{margin-bottom: var(--space-md)!important}
.margin-bottom-sm{margin-bottom: var(--space-sm)!important}
.margin-left{margin-left: var(--space)!important}
.margin-left-md{margin-left: var(--space-md)!important}
.margin-left-sm{margin-left: var(--space-sm)!important}
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
  padding-top: 6px;
  background-color: transparent;
  border-radius: 6px;
}

::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, .25);
  border-radius: 1px;
}
.mini-scrollbar{padding-right: 4px}
.mini-scrollbar::-webkit-scrollbar{width: 4px;}
.mini-scrollbar::-webkit-scrollbar-thumb{border-radius: 4px;}
.width-max {width: 100% !important;}
.width-lg {width: 320px !important;}
.width {width: 240px !important;}
.width-md {width: 200px !important;}
.width-mds {width: 180px !important;}
.width-sm {width: 120px !important;}
.width-xs {width: 100px !important;}
.app-layout {height: 100vh;min-height: 100vh;}
.wrapper,.main-container{padding: var(--space); height: calc(100vh - var(--header-height)); overflow-y: auto}
.border-none{ border: none !important;}
.border-left{border-left: 1px solid var(--border-color);}
.border-bottom{border-bottom: 1px solid var(--border-color);}
.icon-only{padding: 0 8px;}
a:hover{color: var(--color-primary-hover);}
.hover{color: var(--color)}
.hover:hover{cursor: pointer;transition: var(--transition);color: var(--color-primary-hover)}
/*font s-zie*/
.font-size{font-size: 14px}
.font-size-lg{font-size: 16px}
.font-size-sm{font-size: 12px}
/*align*/
.align-center{text-align: center;}
.align-right{text-align: right;}
.align-left{text-align: left;}
/*text color*/
.text-color-gray{color: var(--color-gray);}
.inner-list .ant-list-item{padding-left: 0;padding-right: 0;}
/*下拉列表小图标*/
.ant-icon-down{ font-size: 10px !important; margin-inline-start:4px !important}
.notice-popover .ant-popover-title{padding:8px 16px; border-bottom: 1px solid var(--border-color)}
/*重构a-modal a-modal-header */
.ant-modal .ant-modal-header{margin-bottom: var(--space-lg)}
/*顶部按钮*/
.header-button {
  padding: 0 8px;
  font-size: 14px;
  height: 32px;
  min-width: 32px;
  border-radius: 6px;
  display: inline-block;
  font-weight: 400;
  white-space: nowrap;
  text-align: center;
  line-height: 32px;
  color: var(--color);
  position: relative;
}
.header-button .anticon {color:var(--color);}
.header-button:hover{
  background-color: var(--color-active);
  cursor: pointer;
}
.header-button:hover .anticon {
  color: var(--color-seconedry-active);
  transition: var(--transition)
}
.header-button::after{
  content: "";
  display: block;
  position: absolute;
  height: 14px;
  top: 50%;
  margin-top: -7px;
  width: 1px;
  background-color:#bfbfbf1c;
  right: -10px;
}
.header-button.no-divider::after{
  display: none;
}
/*card style*/
.card-title{
  font-size: 18px;
  font-weight: 500;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.wrapper-header {
  border-radius: var(--radius);
  margin-bottom: var(--space);
  font-weight: 600;
  font-size: 20px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: flex;
  align-items: center;
}
.table-action {
  display: flex;
  justify-items: center;
  gap: 16px;
}
.table-action>span{
  display: flex;
  align-items: center;
  gap: 4px;
  position: relative;
}
.table-action>span+span:before{
  position: absolute;
  content: "";
  height: 14px;
  width: 1px;
  margin-left: -8px;
  background-color: #f0f0f0;
}
.table-action>span.primary{color: var(--color-primary);}
.table-action>span.danger{color: var(--color-danger);}
.table-action>span:hover{
  color: var(--color-primary);
  transition: var(--transition);
  cursor: pointer;
}
.table-action>span.danger:hover{color: var(--color-danger-hover);}
.table-action>span.primary:hover{color: var(--color-primary-hover);}